window.addEventListener('load',function(){
   // 电梯导航
    var fixedtool =document.querySelector('.fixedtool');
    var nav = document.querySelector('nav');
    var navTop = nav.offsetTop;
     var fixedtoolTop = fixedtool.offsetTop-navTop;
     var main = document.querySelector('.main')
     var goBack = fixedtool.querySelector('.goback')
     var mainTop = main.offsetTop;
   
     document.addEventListener('scroll',function(){
        // console.log(window.pageYOffset);
     //console.log(11);
    //  console.log(11);
    //当我们的页面的头部大于或者等于854，改成固定定位，小于的时候改成绝对定位
    if(window.pageYOffset >= navTop){
        fixedtool.style.position = 'fixed';
        fixedtool.style.top = fixedtoolTop+'px';
    }else{
        fixedtool.style.position = 'absolute';
        fixedtool.style.top = 200+'px'

    }  if(window.pageYOffset >= mainTop){
        goBack.style.display = 'block';
    }else{
        
        goBack.style.display = 'none';

    } 
     
     })

   
    //  var ul = focus.querySelector('ul');
    //  焦点图，轮播图
    var arrowL = document.querySelector('.arrow-l')
    var arrowR = document.querySelector('.arrow-r')
    var focus = document.querySelector('.focus');
    var focusWidth = focus.offsetWidth;
    var ul = focus.querySelector('ul');
     var ol = focus.querySelector('ol');
   
    focus.addEventListener('mouseenter',function(){
      arrowL.style.display = 'block';
      arrowR.style.display = 'block';
      timer = setInterval(function(){
        arrowR.click();
    },2000)

    })
     focus.addEventListener('mouseleave',function(){
      arrowL.style.display = 'none';
      arrowR.style.display = 'none';
        clearInterval(timer);
    })
   
    
    
    // 加小圆圈
   for(var i =0;i<ul.children.length;i++){
       var li = document.createElement('li');
       li.setAttribute('index',i)
       ol.appendChild(li);

       li.addEventListener('click',function(){
    for(var i =0;i<ol.children.length;i++){
    ol.children[i].className = '';

}
    this.className = 'current';
    //点击小圆圈移动图片
    var index = this.getAttribute('index');
    num = index;
    count = index;
    console.log(focusWidth);
    animate(ul, -index*focusWidth);

       });
   }
   ol.children[0].className = 'current';
//    克隆第1张图片，进行深克隆
var first = ul.children[0].cloneNode(true);
ul.appendChild(first);
var num =0;
var count = 0;


arrowR.addEventListener('click',function(){

    flag = false;
    if(num==ul.children.length-1){
        ul.style.left = 0+'px';
        num=0;
    }
    num++;
    animate(ul, -num * focusWidth);
    count++;
    if(count == ol.children.length){
        count = 0;
    }
    circleChange();

   })
   arrowL.addEventListener('click',function(){
    if(num==0){
        num=ul.children.length-1;

        ul.style.left =-num* focusWidth+'px';
    }
    num--;
    animate(ul, -num * focusWidth);
    count--;
    if(count < 0){
        count = ol.children.length-1;
    }
    //调用函数
    circleChange();
    
       })
function circleChange(){
    for(var i =0;i<ol.children.length;i++){
        ol.children[i].className = '';
      
    
    }
        ol.children[count].className = 'current';
}
var timer = setInterval(function(){
    arrowR.click();
},2000)


})